Item 1: Image Hyperlink

Click the logo image to jump to another section.

Item 2: Ordered List (5 Items)

Prepare the layout sketch
Pick the color palette
Create the HTML structure
Style with CSS
Review and submit

Item 3: Paragraph Margin Left & Right

This paragraph has custom left and right margins so the text is pulled away from the edges of the page. The spacing makes it easier to read.

Item 4: Paragraph Color + Font

All paragraph text on this section uses a custom font family and color via a CSS rule on the p selector.

Item 5: Frame 4 Windows (2x2)

Top Left

Top Right

Bottom Left

Bottom Right

Item 6: Static Background Logo

The logo is placed in the background and fixed, so it does not move when the page scrolls. Scroll down to see it stay in place.

Item 7: H1 Color + Font

This h1 title is styled with a custom font-family and color.

Item 8: Olympic Logo (Overlapping Text)

Five letter "O" elements overlap using absolute positioning and z-index.

O O O O O

Item 9: Breadcrumb for 3 Pages

Home breadcrumb:

Page 2 breadcrumb:

Page 3 breadcrumb:

Item 10: Media Queries

Resize the browser: at 576px the paragraph becomes red, at 768px it turns blue, and at 992px it turns yellow.

Item 11: Full Static Background Logo

This section shows a complete HTML + CSS example with a static background logo. The logo is set using background-image and fixed in place so it does not move while scrolling.

You can add more content here to demonstrate the watermark effect behind the layout.

Item 12: Table Structure

DAILY JOB OUTPUT FOR DECEMBER 2025
Day 1	45%	Ahmad
Day 2	40%	Balqis
Day 3	15%	Chen
Output	100%